<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<link th:href="@{/plugin/layui/css/layui.css}" rel="stylesheet"/>
<script type="text/javascript" th:src="@{/plugin/layui/layui.js}"></script>
<script type="text/javascript" th:src="@{/js/common.js}"></script>
<body>
<div class="layui-form-item">
<table class="layui-hide" id="test" lay-filter="table"></table>
</div>
<form class="layui-form"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
  <div class="layui-form-item">
    <label class="layui-form-label">输入学号</label>
    <div class="layui-input-block">
      <input type="text" name="cstuid" placeholder="请输入" autocomplete="off" class="layui-input">
    </div>
  </div>
<!--  <div class="layui-input-block">
    <input type="text" name="cstuid" placeholder="学号" autocomplete="off" class="layui-input">
  </div>-->
  <div class="layui-form-item">
    <label class="layui-form-label">下拉选择框</label>
    <div class="layui-input-block">
      <select id="selectLouPan"  name="cteaid" lay-verify="required" lay-filter="selectLouPan">
      </select>
    </div>
  </div>
  <div class="layui-form-item layui-form-text">
    <label class="layui-form-label">请填写留言</label>
    <div class="layui-input-block">
      <textarea name="ccontent" placeholder="请输入内容" class="layui-textarea"></textarea>
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-block">
      <button class="layui-btn" lay-submit lay-filter="saveOrAdd">立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
  <!-- 更多表单结构排版请移步文档左侧【页面元素-表单】一项阅览 -->
</form>
<!--<script src="layui.js"></script>-->
<script>
  layui.use(['form', 'layer', 'table'], function(){

    var form = layui.form,table = layui.table,$ = layui.$; //各种基于事件的操作，下面会有进一步介绍


    table.render({
      elem: '#test'  //绑定table id
      , url: 'pj/liuyan'  //数据请求路径
      , cellMinWidth: 80
      , cols: [
              [
        {type: 'numbers'}
        , {field: 'ruid', title: '学生编号'}
        , {field: 'rcreatetime', title: '插入时间'}
        , {field: 'rcontent', title: '评论的内容'}
        , {field: 'tealRealname', title: '教师'}
        , {field: 'rstate', title: '状态'}
        , {fixed: 'right', title: '操作', width: 180, align: 'center', toolbar: '#toolBar'}//一个工具栏  具体请查看layui官网
      ]
      ]
      , page: true   //开启分页
      , limit: 1  //默认十条数据一页
      , limits: [1, 5, 10, 20]  //数据分页条
      , id: 'testReload'
    });

    /*active = {
      reload: function () {
        var cstuId = $.trim($('#cstuId').val());
        table.reload('testReload', {
          where: {
            cstuId: cstuId
          }
        });
      }
    };*/


    $.ajax({//动态根据接口渲染select下拉框
    type: 'get',
    url: "pj/getAllTeacher",
    dataType:'json',
    async: false,//你自己的接口信息
    success: function (res) {
     // $("#selectLouPan").append("<option value='' checked>"+"请选择楼盘"+"</option>");
      if(res.code == 0){
        for(var i=0;i<res.data.length;i++){
          $("#selectLouPan").append("<option name='teaRealname' value="+res.data[i].teaId+">"+res.data[i].teaRealname+"</option>");
        }
      }else if(res.code == 500){
        layer.msg('返回数据错误');
      }else{
        layer.msg('返回错误');
      }
      form.render('select');
    },
  });



    form.on('submit(saveOrAdd)',function (data){
      var datas = data.field;
      $.ajax({
        url: "pj/addCom",
        type: "POST",
        data: JSON.stringify(datas),
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        success(result){
          if(result.code==100){
            layer.msg("留言成功", {icon: 6});
          //  layer.msg(result.message, {icon: 6});
           // location.reload();
          }else{
            layer.msg(result.message, {icon: 5});
          }

        }, error: function (error) {
         layer.msg('系统异常！请联系管理员', {icon: 5});
        }
      })
    })



  });
</script>
</body>
</html>